<template>
  <div class="welcome">
    <div class="welcome_layout">
      <el-row>
        <!-- 整站数据-->
        <el-col :xs="24"
                :sm="24"
                :md="24"
                :lg="24"
                :xl="24">
          <count class="count"></count>
        </el-col>
      </el-row>
      <el-row class="charts_div1">
        <!-- 图表 -->
        <el-col :xs="8"
                :sm="6"
                :md="4"
                :lg="12"
                :xl="12">
          <chartone class="charts1"></chartone>
        </el-col>
        <el-col :xs="4"
                :sm="6"
                :md="8"
                :lg="12"
                :xl="12">
          <charttwo class="charts2"></charttwo>
        </el-col>
      </el-row>
      <el-row class="charts_div2">
        <!-- 图表 -->
        <el-col :xs="8"
                :sm="6"
                :md="4"
                :lg="8"
                :xl="8">
          <chartthree class="charts3"></chartthree>
        </el-col>
        <el-col :xs="8"
                :sm="6"
                :md="4"
                :lg="8"
                :xl="8">
          <chartfour class="charts4"></chartfour>
        </el-col>
        <el-col :xs="4"
                :sm="6"
                :md="8"
                :lg="8"
                :xl="8">
          <chartfive class="charts5"></chartfive>
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script>
import count from '../components/welcome/count.vue'
import chartone from '../components/welcome/dialChart.vue'
import charttwo from '../components/welcome/moneyPlanChart.vue'
import chartthree from '../components/welcome/ownerChart.vue'
import chartfour from '../components/welcome/repairDealChart.vue'
import chartfive from '../components/welcome/userChangeChart.vue'
export default {
  components: {
    count,
    chartone,
    charttwo,
    chartthree,
    chartfour,
    chartfive,
  },
  created () { },
}
</script>
<style scoped>
.welcome {
  width: 100%;
  height: 100%;
}
.welcome_layout {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
}
.count {
  height: 100px;
}
.charts_div1 {
  margin-top: 10px;
}
.charts_div2 {
  margin-top: 15px;
}
.charts1,
.charts2 {
  height: 380px;
}
.charts3,
.charts4,
.charts5 {
  height: 300px;
  margin-bottom: 15px;
}
</style>